<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <link rel="icon" href="favicon.ico" mce_href="favicon.ico" type="image/x-icon">  
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link href="https://cdn.bootcss.com/Swiper/4.3.0/css/swiper.min.css" rel="stylesheet">
  <link rel="stylesheet" href="css/style.css">
  <script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
  <script src="https://cdn.bootcss.com/Swiper/4.3.0/js/swiper.min.js"></script>
  <script src="http://api.map.baidu.com/api?v=2.0&ak=0kNSt02YZZC19NqSX3q2oS8ywEjN6fvK"></script>
  <title>联系我们</title>
</head>
<body>
  <header class="header-bar">
    <div class="containter clearfix">
      <img class="logo" src="image/210850_100X100.png" alt="">
      <ul class="nav">
        <li><a href="homepage.html">首页</a></li>
        <li><a href="about.html">公司简介</a></li>
        <li class="active"><a href="contact.html">联系我们</a></li>
      </ul>
    </div>
  </header>
  <section>
    <div class="banner contact-banner">
      <div class="swiper-container">
        <div class="swiper-wrapper">
          <!--<div class="swiper-slide"><div class="banner-img img1"></div></div>
          <div class="swiper-slide"><div class="banner-img img2"></div></div>
          <div class="swiper-slide"><div class="banner-img img3"></div></div>
          <div class="swiper-slide"><div class="banner-img img4"></div></div>-->
          <div class="swiper-slide"><div class="banner-img"><img src="image/230499.jpg" alt=""></div></div>
          <div class="swiper-slide"><div class="banner-img"><img src="image/212413.jpg" alt=""></div></div>
          <div class="swiper-slide"><div class="banner-img"><img src="image/212412.jpg" alt=""></div></div>
          <div class="swiper-slide"><div class="banner-img"><img src="image/217960.jpg" alt=""></div></div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
        <!-- Add Arrows -->
        <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div>
      </div>
    </div>
    <div class="contact-us">
      <div class="m-title">
        <i>CONTACT<span>US</span></i>
        <h2>联系我们</h2>
      </div>
      <div class="contact-info clearfix">
        <ul class="contact-info-con">
          <li>
            <label>公司地址：</label>
            <div>广州市白云区江夏强盛商务大厦G栋</div>
          </li>
          <li>
            <label>电话：</label>
            <div>
              <p>020-36704686</p>
              <p></p>
              <p></p>
            </div>
          </li>
          <li>
            <label>网址：</label>
            <div>www.qinn.vip</div>
          </li>
          <li>
            <label>邮箱：</label>
            <div>qinn_vip@163.com</div>
          </li>
        </ul>
        <div class="contact-info-map" id="allmap"></div>
      </div>
    </div>
  </section>
  <footer class="footer-bar">
    <div class="contact-us">
      <div class="m-title">
        <i>CONTACT<span>US</span></i>
        <h2>联系我们</h2>
      </div>
      <ul class="contact-us-list">
        <li>
          <img src="image/-3606.png" alt="">
          <h2>地址</h2>
          <p>广州市白云区江夏强盛商务大厦G栋</p>
        </li>
        <li>
          <img src="image/-3607.png" alt="">
          <h2>电话</h2>
          <p>固话：020-36704686</p>
          <p></p>
          <p></p>
        </li>
        <li>
          <img src="image/-3608.png" alt="">
          <h2>邮箱</h2>
          <p>qinn_vip@163.com</p>
        </li>
      </ul>
      <div class="us-name">亲恩 11年孕妇护肤品牌</div>
    </div>
  </footer>
  <script>
    $(function(){
      var swiper = new Swiper('.swiper-container', {
        loop: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: {
          delay: 2500,
          disableOnInteraction: false,
        },
        pagination: {
          el: '.swiper-pagination',
          clickable: true,
        },
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
        },
      });
      //
      var map = new BMap.Map("allmap");
      map.centerAndZoom(new BMap.Point(113.286808,23.218312),18);
      map.enableScrollWheelZoom(true);
      var top_left_control = new BMap.ScaleControl({anchor: BMAP_ANCHOR_TOP_LEFT});// 左上角，添加比例尺
      var top_left_navigation = new BMap.NavigationControl();  //左上角，添加默认缩放平移控件
      var top_right_navigation = new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL}); //右上角，仅包含平移和缩放按钮
      /*缩放控件type有四种类型:
      BMAP_NAVIGATION_CONTROL_SMALL：仅包含平移和缩放按钮；BMAP_NAVIGATION_CONTROL_PAN:仅包含平移按钮；BMAP_NAVIGATION_CONTROL_ZOOM：仅包含缩放按钮*/
      theLocation();
      add_control();
      //添加控件和比例尺
      function add_control(){
        map.addControl(top_left_control);
        map.addControl(top_left_navigation);
        map.addControl(top_right_navigation);
      }
      function theLocation(){
        map.clearOverlays();
        var new_point = new BMap.Point(113.286808,23.218312);
        var marker = new BMap.Marker(new_point);  //
        map.addOverlay(marker);              //
        map.panTo(new_point);

      }
    })
  </script>
</body>
</html>